<template>
    <el-row :gutter="20" class="mt-5">
        <el-col
                :span="3"
                :offset="0"
                v-for="(item, index) in userAllList"
                :key="index"
        >
            <el-card shadow="hover">
                <div class="flex flex-col items-center justify-center cursor-pointer">
                    <span class="text-sm mt-2" style='white-space:nowrap;'>{{ item.username }}</span>
                    <el-tag  v-if="item.type == 0">个人用户</el-tag>
                    <el-tag class="ml-2" type="success" v-else-if="item.type == 10">超级管理员</el-tag>
                    <el-tag class="ml-2" type="warning" v-else-if="item.type == 1">企业管理员({{ item.company_name }})</el-tag>
                    <el-tag class="ml-2"  v-else-if="item.type == 2">企业员工({{ item.company_name }})</el-tag>
                    <el-tag class="ml-2" type="success" v-else-if="item.type == 3">企业负责人({{ item.company_name }})</el-tag>
                </div>
            </el-card>
        </el-col>
    </el-row>
</template>
<script setup>
// vue 方法
import {ref,onMounted} from "vue";

  // api
  import {
    getALLUserList,
  } from "~/api/user/index"


const userAllList = ref([])
onMounted(() => {
  // 获取用户信息
  getALLUserList({}).then((res) => {
    userAllList.value = res.data
  })
})

</script>